<style>
body {
	width: 350px;
	font-family: Verdana;
	font-size: 10px;
}
input {
	border: 1px solid gray;
	width: 250px;
}
input[type="submit"] {
	width: 75px;
}
</style>

<body onload="document.getElementById('server').focus();">
	<form>
		<input type="text" name="server" id="server" value="irc://irc.mibbit.net/mibbit" />
		<input type="submit" value="Connect" onClick="go();"/>
		<p>
			Format:
			<ul>
				<li>irc://&lt;host&gt;[:&lt;port&gt;]/[&lt;channel&gt;[?&lt;password&gt;]]</li>
				<li>ircs://&lt;host&gt;[:&lt;port&gt;]/[&lt;channel&gt;[?&lt;password&gt;]]</li>
			</ul>
			Channelnames are without the first # sign.<br>
			E.g. #mibbit would be mibbit and ##mibbit would be #mibbit<br>
		</p>
	</form>
</body>

<script>
function go() {
	url = rewriteIRCtoMibbitUrl(document.getElementById("server").value);
	//check if there is already a mibbit tab, if yes use some magic javascript
	chrome.tabs.create({url: url});
}
function rewriteIRCtoMibbitUrl(inUrl) {
  var retUrl = inUrl;
  retUrl = inUrl.split("/");
	if (retUrl[0] == "irc:") {
		return "http://www.mibbit.com/#" +retUrl[3]+ "@" +retUrl[2];
	}
	else if (retUrl[0] == "ircs:") {
		port = retUrl[3].split(":");
		if (!port[1]) {
			return "https://www.mibbit.com/#" +retUrl[3]+ "@" +retUrl[2]+ ":+6697";
		}
		else {
			return "https://www.mibbit.com/#" +port[0]+ "@" +retUrl[2]+ ":+" +port[1];
		}
	}
}
</script>
